<template>
	<div class="home_ban">
		<div class="m_banner clearfix" id="my_banner">
			<swiper :options="swiperOption" ref="mySwiper">
				<swiper-slide v-for="item in bannerList" :key="item.Path">
						<img :src="root + item.Path" alt="" style="height: 200px;width: 100%;"/>
				</swiper-slide>
				<div class="swiper-pagination" slot="pagination"></div>
			</swiper>
		</div>
	</div>
</template>
<script>
	export default {
		created() {
			this.getBannerData();
		},
		data() {
			return {
				root: this.root,
				bannerList: [],
				swiperOption: {
					initialSlide: 0,
					pagination: {
						el: '.swiper-pagination',
					},
					loop: true,
					speed: 400,
					autoplay: {
						delay: 4500,
						disableOnInteraction: false,
					},
					observer: true, //修改swiper自己或子元素时，自动初始化swiper
					observeParents: true //修改swiper的父元素时，自动初始化swiper
				}
			}
		},
		methods: {
			getBannerData() {
				var _this = this;
				_this.$http.get('/Client/Banners', null, localStorage.Authorization, res => {
					console.log('轮播图res', res)
					if(res.code === 200) {
						_this.bannerList = res.data.list
					}else if(res.code === 101) {
						localStorage.fromPath = _this.$route.fullPath
						_this.$router.push({
							path: '/wx/login'
						})
					}
				})
			},
		}
		
	}
</script>